<template>
	<div class="box">
		999
		<treeCom :treeData="treeData" />
	</div>
</template>
<script>
	import treeJson from './tree.json'
	export default {
		data() {
			return {
				treeData: []
			}
		},
		mounted() {
			console.log(treeJson)
			//this.treeData = treeJson.data.webResources
			this.dealTree(treeJson.data.webResources)
		},
		methods: {
			dealTree(data) {
				var nodes = []

				function Vnode(config) {
					console.log(config)
					var _vCode = {
						name: config.name,
						children: [],
						roleSelect: config.roleSelect,
						pageId: config.pageId,
						id: config.id,
						type: config.type,
						leave: config.leave,
						isExpand: false,
						expand: function () {
							console.log(this)
							this.isExpand = !this.isExpand
						},
						checkStatus: function () {
							this.roleSelect = !this.roleSelect
							console.log(this.roleSelect)
							console.log(this.children)

							function statusChange(statusData, roleSelect) {
								for (var k in statusData) {
									statusData[k].roleSelect = roleSelect
									if (statusData[k].children && statusData[k].children.length > 0) {
										statusChange(statusData[k].children, roleSelect)
									}
								}
							}

							if (this.children && this.children.length > 0) {
								statusChange(this.children, this.roleSelect)
							}



						},
						append: function (node) {
							console.log(node)
							console.log('接受')
							this.children.push(node)

						}
					}
					var pageChildren = config.pageChildren
					var child = config.children
					if (pageChildren && pageChildren.length > 0) {
						for (var k in pageChildren) {
							pageChildren[k].type = 'page'
							pageChildren[k].leave = config.leave + 1
							console.log(pageChildren[k])
							_vCode.append(Vnode(pageChildren[k]))
						}

					}
					if (child && child.length > 0) {
						for (var j in child) {
							child[j].type = 'button'
							child[j].leave = config.leave + 1
							_vCode.append(Vnode(child[j]))

						}
					}
					return _vCode
				}

				data.forEach(item => {
					item.leave = 0
					item.type = 'page'
					nodes.push(Vnode(item))

				});
				console.log(nodes)
				this.treeData = nodes
			}
		},
	}
</script>
<style scoped>
	.box {
		width: 1000px;
		margin: 20px auto;
	}
</style>